@space: 1rem;
@spacers: {
  0: 0;
  1: calc(@space / 2);
  2: @space;
  3: calc(@space*1.5);
};

each(@spacers, {
    .p-@{key}{
        padding: @value !important;
    }
    .m-@{key}{
        margin: @value !important;
    }
    .pt-@{key}{
        padding-top: @value !important;
    }
    .mt-@{key}{
        margin-top: @value !important;
    }
    .pb-@{key}{
        padding-bottom: @value !important;
    }
    .mb-@{key}{
        margin-bottom: @value !important;
    }
    .pl-@{key}{
        padding-left: @value !important;
    }
    .ml-@{key}{
        margin-left: @value !important;
    }
    .pr-@{key}{
        padding-right: @value !important;
    }
    .mr-@{key}{
        margin-right: @value !important;
    }
    .px-@{key}{
        padding-right: @value !important;
        padding-left: @value !important;
    }
    .mx-@{key}{
        margin-right: @value !important;
        margin-left: @value !important;
    }
    .py-@{key}{
        padding-top: @value !important;
        padding-bottom: @value !important;
    }
  .my-@{key}{
        margin-top: @value !important;
        margin-bottom: @value !important;
    }
});
